<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>在线学习技术分享平台</title>
		<link rel="stylesheet" href="../../resources/css/userquestion.css" />
		<link rel="stylesheet" href="../../resources/layui/css/layui.css" />
		<script type="text/javascript" src="../../resources/js/jquery-1.11.1.min.js"></script>

	</head>

	<body>
		<script>
			//去掉所有的html标记
			function delHtmlTag(str) {
				return str.replace(/<[^>]+>/g, "");
			}
		</script>
		<jsp:include page="/pages/common/header.jsp"></jsp:include>
		<div class="main_content">
			<div class="head">
			</div>
			<div class="main">
				<ul class="content">
					<li class="l_question_box">
						<div class="l_content">
							<div class="user_icon">
								<img src="../../resources/images/course_flow1.png" />
							</div>
							<div class="username">whyzaa</div>
						</div>
						<div class="r_content">
							<div class="r_content_big_type">
								<span class="text">所属分类:</span>
								<span class="tag">html</span>
								<div class="xs">
									<span class="text">悬赏：</span>
									<span class="jf">15分</span>
								</div>
							</div>
							<div class="r_content_question_title">
								<a href="questiondetails.jsp?questionid=1">
									<p>使用spring框架的好处</p>
								</a>
							</div>
							<div class="b_other">
								<span class="layui-icon layui-icon-date"></span>
								<span class="date">2019-3-26 00:00:01</span>
								<span class="layui-icon layui-icon-dialogue"></span>
								<span class="comment_nummber">12</span>
								<span class="layui-icon layui-icon-log"></span>
								<span class="sea_nummber">122</span>
							</div>
						</div>
						<div class="r_status">
							<span class="status layui-icon layui-icon-ok"></span>
							<span class="status_text">已解决</span>
						</div>
						<div class="reslove">
							<img src="../../resources/images/caina.png" />
						</div>
					</li>
				</ul>

				<div class="r_box">
					<div class="put_question">
						<img src="../../resources/images/index.png" />
						<div class="btn">
							<p class="text">
								发布问题、获得积分
							</p>
						</div>
						<div class="bg_fb">
							<a href="#" id="addquestion">
								<p>发布问题</p>
							</a>

						</div>
					</div>
					<div class="h_question">
						<div class="r_box_head">
							<span class="layui-icon layui-icon-fire"></span>
							<span>热门问题</span>
						</div>
						<ul class="hot_ques">
							<li class="hot_ques_detail">
								<div class="ques_title">
									<p>xxxxxxxxxxxxxxxx</p>

								</div>
								<div class="ques_other">
									<span class="layui-icon layui-icon-dialogue"></span>
									<span class="nummber">10人</span>

									<span class="layui-icon layui-icon-username"></span>
									<span class="nummber">whyzaa</span>

								</div>
							</li>

							<li class="hot_ques_detail">
								<div class="ques_title">
									<p>xxxxxxxxxxxxxxxx</p>
								</div>
								<div class="ques_other">
									<span class="layui-icon layui-icon-dialogue"></span>
									<span class="nummber">10人</span>

									<span class="layui-icon layui-icon-username"></span>
									<span class="nummber">whyzaa</span>
								</div>
							</li>
						</ul>
					</div>
				</div>
				<div style="clear: both;"></div>
				<!--分页-->
				<div id="page">
				</div>
			</div>
		</div>

		<jsp:include page="/pages/common/footer.jsp"></jsp:include>

		<script>
			$(document).ready(function() {
				//				var loading = layer.msg('加载中！请稍后....', {
				//					icon: 16,
				//					shade: 0.01
				//				});
				$.ajax({
					type: "post",
					url: "/article/queryAllQuestion.action",
					data: {
						"pageCount": 1,
						"pageSize": 7
					},
					dataType: "json",
					success: function(result) {
						console.log(result.row);
						var currpage = result.totalPage;
						var pagecount = result.pageSize;
						layui.use("laypage", function() {
							var laypage = layui.laypage;
							laypage.render({
								elem: 'page',
								count: currpage * pagecount, //总页数
								limit: 7,
								jump: function(obj, first) {
									console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
									console.log(obj.limit); //得到每页显示的条数
									var pageIndex = obj.curr;
									var pageLimit = obj.limit;
									//首次不执行
									if(!first) {
										$(".content").html("");
										toPage(pageIndex, pageLimit);
									}
								}
							});
						});
						$.each(result.row, function(rowindex, rowitem) {
							if(rowitem.userPhoto == undefined) {
								rowitem.userPhoto = "../../resources/images/course_flow1.png";
							}
							console.log(rowitem.interal);
							var li = "";
								li += "<li class='l_question_box'><div class='l_content'><div class='user_icon'>";
								li += "<img src='" + rowitem.userPhoto + "' /></div>"
								li += "<div class='username'>" + rowitem.userName + "</div></div>"
								li += "<div class='r_content'><div class='r_content_big_type'>"
								li += "<span class='text'>所属分类:</span><span class='tag'>" + rowitem.typeValue + "</span><div class='xs'> <span class='text'>悬赏：</span> <span class='jf'>"+rowitem.interal+"分</span> </div></div>"
								li += "<div class='r_content_question_title'><a href='questiondetails.jsp?questionid=" + rowitem.articleId + "'>"
								li += "<p>" + delHtmlTag(rowitem.articleTitle) + "</p></a></div>"
								li += "<div class='b_other'><span class='layui-icon layui-icon-date'></span>"
								li += "<span class='date'>" + rowitem.releaseTime + "</span><span class='layui-icon layui-icon-dialogue'></span>"
								li += "<span class='comment_nummber'>" + rowitem.commentNumber + "</span>"								
							if(rowitem.question_state == 0) {
								var questionState = "已解決";
								li += "<span class='layui-icon layui-icon-log'></span><span class='sea_nummber'>" + rowitem.readNumber + "</span></div></div>"
								li += "<div class='r_status' style='color: #5FB878'><span class='status layui-icon layui-icon-ok'></span>"
								li += "<span class='status_text'>" + questionState + "</span></div>"
								li += "<div class='reslove'> <img src='../../resources/images/caina.png' /> </div></li>"
							} else {
								var questionState = "未解決";
								li += "<span class='layui-icon layui-icon-log'></span><span class='sea_nummber'>" + rowitem.readNumber + "</span></div></div>"
								li += "<div class='r_status' style='color:red'><span class='status layui-icon layui-icon-close'></span>"
								li += "<span class='status_text'>" + questionState + "</span></div>"
							}
							$(".content").append(li);
						});
						layer.msg('加载成功！！', {
							icon: 1,
							time: 1000,
						});
					}
				});
			})
		</script>
		<script>
			function toPage(pageCount, pageSize) {
				var loading = layer.msg('加载中！请稍后....', {
					icon: 16,
					shade: 0.01
				});
				$.ajax({
					type: "get",
					url: "/article/queryAllQuestion.action",
					data: {
						"pageCount": pageCount,
						"pageSize": pageSize
					},
					dataType: "json",
					success: function(result) {
						$.each(result.row, function(rowindex, rowitem) {
							if(rowitem.userPhoto == undefined) {
								rowitem.userPhoto = "../../resources/images/course_flow1.png";
							}
							var li = "";
								li += "<li class='l_question_box'><div class='l_content'><div class='user_icon'>";
								li += "<img src='" + rowitem.userPhoto + "' /></div>"
								li += "<div class='username'>" + rowitem.userName + "</div></div>"
								li += "<div class='r_content'><div class='r_content_big_type'>"
								li += "<span class='text'>所属分类:</span><span class='tag'>" + rowitem.typeValue + "</span><div class='xs'> <span class='text'>悬赏：</span> <span class='jf'>"+rowitem.interal+"分</span> </div></div>"
								li += "<div class='r_content_question_title'><a href='questiondetails.jsp?questionid=" + rowitem.articleId + "'>"
								li += "<p>" + delHtmlTag(rowitem.articleTitle) + "</p></a></div>"
								li += "<div class='b_other'><span class='layui-icon layui-icon-date'></span>"
								li += "<span class='date'>" + rowitem.releaseTime + "</span><span class='layui-icon layui-icon-dialogue'></span>"
								li += "<span class='comment_nummber'>" + rowitem.commentNumber + "</span>"								
							if(rowitem.question_state == 0) {
								var questionState = "已解決";
								li += "<span class='layui-icon layui-icon-log'></span><span class='sea_nummber'>" + rowitem.readNumber + "</span></div></div>"
								li += "<div class='r_status' style='color: #5FB878'><span class='status layui-icon layui-icon-ok'></span>"
								li += "<span class='status_text'>" + questionState + "</span></div>"
								li += "<div class='reslove'> <img src='../../resources/images/caina.png' /> </div></li>"
							} else {
								var questionState = "未解決";
								li += "<span class='layui-icon layui-icon-log'></span><span class='sea_nummber'>" + rowitem.readNumber + "</span></div></div>"
								li += "<div class='r_status' style='color:red'><span class='status layui-icon layui-icon-close'></span>"
								li += "<span class='status_text'>" + questionState + "</span></div>"
							}
							$(".content").append(li);
						});
						layer.msg('加载成功！！', {
							icon: 1,
							time: 1000,
						});

					}
				});
			}
		</script>
		<script>
			$("#addquestion").click(function() {
				<c:choose>
				<c:when test = "${empty sessionScope.userId}" >
					layer.msg('您还未登陆！', {
						icon: 2,
						time: 2000,
						end: function() {
							var index = layer.open({
								type: 2,
								title: '注册/登陆',
								shadeClose: true,
								area: ['420px', '380px'],
								content: '/pages/relogin/login.jsp'
							});
						}
					}); 
						return false;
				</c:when> 
				<c:otherwise>
						window.location.href=("/pages/question/questionedit.jsp")
				</c:otherwise>
			</c:choose>
		})
		</script>
	</body>

</html>